<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title></title>


    <style type="text/css">
        .search_input {
            overflow: visible;
            background-color: #FFFFFF;
            background-image: none;
            border: 1px solid #e5e6e7;
            border-radius: 1px;
            color: inherit;
            display: block;
            padding: 6px 12px;
            transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
        }
    </style>
</head>

<body>


<div class="breadcome-area">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="breadcome-list single-page-breadcome">
                    <div class="row">
                        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                            <div class="breadcome-heading">
                                <form id="searchForm" role="search" class="sr-input-func">
                                    <input type="text" name="planName" placeholder="请输入任务
												名称" class="search-int form-control">
                                    <a href="javascript:void(0)" onclick="operation.searchForm()"><i
                                            class="fa fa-search"></i></a>
                                </form>
                            </div>
                        </div>
                        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                            <ul class="breadcome-menu">
                                <li><a href="#">首页</a> <span class="bread-slash">/</span>
                                </li>
                                <li><span class="bread-blod">制定检修计划</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="mg-b-15">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="product-status-wrap drp-lst">
                    <h4>制定检修计划</h4>
                    <div class="add-product">
                        <a href="#" onclick="operation.addWindow()">添加</a>
                    </div>
                    <div class="asset-inner">

                        <table id="dg"></table>


                    </div>


                </div>
            </div>
        </div>
    </div>
</div>


<!-- 第一个model 开始 -->
<div id="setFormModal" class="modal fade" tabindex="-1" role="dialog" data-backdrop="static" data-keybord="false">
    <div class="modal-dialog" style="width:700px">
        <div class="modal-content">
            <div class="modal-header">
                编辑
            </div>
            <!-- modal-body 开始 -->
            <div class="modal-body">
                <form id="setFormId" class="form-horizontal" enctype="multipart/form-data">
                    <input type="hidden" name="id">


                    <div id="data">
                        <div class="form-group row">
                            <label class="col-sm-4 col-form-label text-right" for="planName">任务名称</label>
                            <div class="col-sm-6">
                                <input class="form-control" name="planName" placeholder="请输入任务名称"/>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-4 col-form-label text-right" for="planType">检修部位</label>
                            <div class="col-sm-6">
                                <select class="form-control" name="planType" placeholder="请输入">
                                    <option value="">--请选择--</option>
                                    <option value="中检">中检</option>
                                    <option value="小检">小检</option>
                                    <option value="辅检">辅检</option>
                                    <option value="临检">临检</option>
                                    <option value="其他">其他</option>
                                </select>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label class="col-sm-4 col-form-label text-right" for="planInfo">任务描述</label>
                            <div class="col-sm-6">
                            <textarea class="form-control" rows="3" name="planInfo"
                                      placeholder="请输入任务描述"></textarea>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-4 col-form-label text-right" for="planFinishTme">计划完成时间</label>
                            <div class="col-sm-6">
                                <input class="form-control" id="planFinishTme" name="planFinishTme"
                                       placeholder="请输入计划完成时间"/>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-4 col-form-label text-right" for="planZq">计划周期</label>
                            <div class="col-sm-6">
                                <select class="form-control" name="planZq" placeholder="请输入">
                                    <option value="">--请选择--</option>
                                    <option value="一周">一周</option>
                                    <option value="二周">二周</option>
                                    <option value="三周">三周</option>
                                    <option value="一月">一月</option>
                                    <option value="一年">一年</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-4 col-form-label text-right" for="planWorkhours">工时</label>
                            <div class="col-sm-6">
                                <input class="form-control" name="planWorkhours" planWorkhours="请输入任务名称"/>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-4 col-form-label text-right" for="Fj">选择文件</label>
                            <div class="col-sm-6">
                                <input class="form-control" id="fj" name="fj" type="file"/>
                                <input type="hidden" id="fjmc" name="fjmc">
                            </div>
                        </div>
                    </div>
                    <div id="sh">
                        <div class="form-group row">
                            <label class="col-sm-4 col-form-label text-right" for="shzt">审核结果</label>
                            <div class="col-sm-6">
                                <select id="shzt" class="form-control" name="shzt" placeholder="请输入">
                                    <option value="">--请选择--</option>
                                    <option value="通过">通过</option>
                                    <option value="拒绝">拒绝</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label class="col-sm-4 col-form-label text-right" for="Fj">拒绝原因</label>
                            <div class="col-sm-6">
                                <input class="form-control" id="jjyy" name="jjyy"/>
                            </div>
                        </div>
                    </div>

                </form>


            </div>
            <!-- modal-body 结束 -->
            <div class="modal-footer">
                <button id="add_save_btn" type="button" class="btn btn-default btn-outline btn-sm"
                        onclick="operation.addForm()">
                    <span class="glyphicon glyphicon-ok"></span>保存
                </button>
                <button id="edit_save_btn" type="button" class="btn btn-default btn-outline btn-sm"
                        onclick="operation.editForm()">
                    <span class="glyphicon glyphicon-ok"></span>保存
                </button>
                <button id="delete_save_btn" type="button" class="btn btn-default btn-outline btn-sm"
                        onclick="operation.closeMoal()">
                    <span class="glyphicon glyphicon-remove"></span>关闭
                </button>
            </div>

        </div>
    </div>
</div>
<!-- 第一个model 结束 -->

<!-- Page-Level Scripts -->
<script type="text/javascript" th:inline="none">
    var url = "";

    //初始化fileinput控件（第一次初始化）
    function initFileInput(ctrlName, uploadUrl, saveUrl) {
        var control = $('#' + ctrlName);
        control.fileinput({
            language: 'zh', //设置语言
            uploadUrl: uploadUrl, //上传的地址
            allowedFileExtensions: [],//接收的文件后缀
            uploadAsync: false,
            showUpload: false, //是否显示上传按钮
            showCaption: false,//是否显示标题
            maxFileCount: 1, //表示允许同时上传的最大文件个数
            browseClass: "btn btn-primary", //按钮样式
            previewFileIcon: "<i class='glyphicon glyphicon-king'></i>",

        }).on("change", function () {
            url = null;
            // // 清除掉上次上传的图片
            // $(".uploadPreview").find(".file-preview-frame:first").remove();
            // $(".uploadPreview").find(".kv-zoom-cache:first").remove();
            // alert("选择图片");
        }).on("filebatchselected", function (e, files) {
            //$(this).fileinput("upload");             // 文件选择完直接调用上传方法。

        }).on('fileuploaded', function (event, data) {//异步上传成功结果处理


            sessionStorage.setItem("fjurl", data.response.url)
            url = data.response.url;
            var control = $('#' + saveUrl);
            control.val = url;
            console.log(data);
        }).on('fileerror', function (event, data, msg) {//异步上传失败结果处理
            // alert("fileerror");
            console.log(event, data, msg);
        }).on('fileuploaderror', function (event, data, msg) {//异步上传失败结果处理
            // alert("fileuploaderror");
            console.log(event, data, msg);
        }).on('filebatchuploadsuccess', function (event, data, previewId, index) {
            // alert("filebatchuploadsuccess");
            // sessionStorage.setItem("fjurl",data.url)
            // var control = $('#' + saveUrl);
            // control.attr(saveUrl,  data.url);
            // control.val =  data.url;
            // url =  data.url;
            // console.log(data);
        });


        // $("#imgFile").fileinput({
        //     language: 'zh', //设置语言
        //     uploadUrl: "/common/uploadFile", //上传的地址
        //     allowedFileExtensions: ['jpg','png'],//接收的文件后缀
        //     uploadAsync: false, //默认异步上传,这里设置了同步
        //     showUpload: false, //是否显示上传按钮
        //     showRemove : true, //显示移除按钮
        //     showPreview : true, //是否显示预览
        //     showCaption: false,//是否显示标题
        //     browseClass: "btn btn-primary", //按钮样式
        //     dropZoneEnabled: false,//是否显示拖拽区域
        //
        //     autoReplace:true,//是否可替换
        //     enctype: 'multipart/form-data',
        //     validateInitialCount:true
        // });
    }

    var userid = sessionStorage.getItem("userid");
    initFileInput("fj", "/common/uploadFile", "fjmc")
    $('#planStar').datetimepicker({
        format: 'yyyy-mm-dd',
        minView: 2,
        //minDate: '2016-7-1'
    })
    $('#planFinishTme').datetimepicker({
        format: 'yyyy-mm-dd',
        minView: 2,
        //minDate: '2016-7-1'
    })

    $('#planEnd').datetimepicker({
        format: 'yyyy-mm-dd',
        minView: 2,
        //minDate: '2016-7-1'
    })


    var operation = {
        download: function (index) {
            var row = $("#dg").bootstrapTable("getData")[index];
            var strings = row.planFj.split("_");
            var url = "/common/downloadFile?url=" + row.planFj;
            window.open(url);
            // $.post("/common/downloadFile", {url: row.planFj}, function (data) {
            //     //
            //     // // 成功获取文件流
            //     // var blob = data;
            //     // // 创建临时链接并触发下载
            //     debugger
            //     // 成功获取文件流
            //     var blob = data;
            //     // 创建临时链接并触发下载
            //     var link = document.createElement('a');
            //     link.href = window.URL.createObjectURL(blob);
            //     link.download =  bookname+new Date().getTime()+'.txt'; // 设置下载文件的名称
            //     document.body.appendChild(link);
            //     link.click();
            //     document.body.removeChild(link);
            //
            // });
        },
        searchForm: function () {
            $('#dg').bootstrapTable("refresh");
        },
        //弹出添加页面
        addWindow: function () {
            $('#setFormModal').modal('show');
            formObj.setBtnIsShow("add_save_btn", "edit_save_btn", 1);
            formObj.setBtnIsShow("data", "sh", 1);

        },
        //添加表单
        addForm: function () {
            $("#setFormId").bootstrapValidator('validate');
            if ($("#setFormId").data("bootstrapValidator").isValid()) {
                var temp = getFormJson("setFormId");
                temp.planFj = url;
                $.post("/ZcxPlanTask/insertZcxPlanTask", temp, function (data) {

                    $("#dg").bootstrapTable("refresh");
                    message.alert(data.showInfo);
                    // var id =  data.showInfo.data.id;
                    $('#setFormId').data('bootstrapValidator').resetForm(true);
                    $('#setFormId')[0].reset();
                    $('#setFormModal').modal('hide');
                });
            }

        },
        //弹出修改页面
        tj: function (index) {
            var row = $("#dg").bootstrapTable("getData")[index];
            $.post("/ZcxPlanTask/tj", {id: row.id, shzt: "待审核"}, function (data) {
                $("#dg").bootstrapTable("refresh");
                message.alert(data.showInfo);
                $('#setFormId').data('bootstrapValidator').resetForm(true);
                $('#setFormId')[0].reset();
                $('#setFormModal').modal('hide');

            });

        },    //弹出修改页面
        sh: function (index) {
            var row = $("#dg").bootstrapTable("getData")[index];
            setForm("#setFormId", row);
            $('#setFormModal').modal('show');
            formObj.setBtnIsShow("data", "sh", 0);
            formObj.setBtnIsShow("add_save_btn", "edit_save_btn", 0);

        },
        //弹出修改页面
        editWindow: function (index) {
            var row = $("#dg").bootstrapTable("getData")[index];
            setForm("#setFormId", row);
            $('#setFormModal').modal('show');
            formObj.setBtnIsShow("data", "sh", 1);
            formObj.setBtnIsShow("add_save_btn", "edit_save_btn", 0);

        },
        //修改表单
        editForm: function () {
            var validate = $("#setFormId").bootstrapValidator('validate');
            if ($("#setFormId").data("bootstrapValidator").isValid()) {
                var temp = getFormJson("setFormId");
                if (url) {
                    temp.planFj = url;
                }
                $.post("/ZcxPlanTask/updateZcxPlanTask", temp, function (data) {
                    $("#dg").bootstrapTable("refresh");
                    message.alert(data.showInfo);
                    $('#setFormId').data('bootstrapValidator').resetForm(true);
                    $('#setFormId')[0].reset();
                    $('#setFormModal').modal('hide');

                });
            }

        },
        //删除表单
        deleteFrom: function (index) {
            var row = $("#dg").bootstrapTable("getData")[index];
            bootbox.confirm({
                size: "small",
                title: "提示",
                message: "确认删除这条数据吗？",
                callback: function (result) {
                    if (result) {
                        $.post("/ZcxPlanTask/deleteZcxPlanTask", {id: row.id}, function (data) {

                            $("#dg").bootstrapTable("refresh");
                            message.alert(data.showInfo);

                        });

                    }
                }
            });


        },
        //关闭页面
        closeMoal: function () {
            $('#setFormId').data('bootstrapValidator').resetForm(true);
            //$('#setFormId').reset();
            $('#setFormModal').modal('hide');
        },
        //导出
        exportFile: function () {


        },
        //审核
        audit: function () {


        },


    }


    $(function () {
        //表格格式化
        var fmt = {
            queryParams: function (params) {
                var temp = getFormJson("searchForm");
                temp.rows = params.limit;
                temp.currentPage = (params.offset / params.limit) + 1;
                return temp;

            },
            setTime: function (value, row, index) {

                return formatTimeYMDhms(value);  //转成年月日时分秒
            },
            download: function (value, row, index) {
                var html = ' ';
                // var html = ' <a href="/common/downloadFile?url='+row.planFj+'>'+value+'</a>';
                /* '<button class="btn-white btn btn-xs">查看</button>'+ */
                html += '<button id="edit_btn" class="btn btn-outline-secondary btn-sm"  onclick="operation.download(' + index + ')">' + value + '</button>';

                return html;  //转成年月日时分秒
            },
            setOpt: function (value, row, index) {
                var html = '';
                var userjobid = sessionStorage.getItem("userjobid");
                var userName = sessionStorage.getItem("userName");
                if (userjobid == 11 && row.shzt == "待审核") {
                    /* '<button class="btn-white btn btn-xs">查看</button>'+ */
                    html += '<button id="edit_btn" class="btn btn-outline-secondary btn-sm"  onclick="operation.sh(' + index + ')">审核</button>';
                    return html;
                } else if (row.planFzr == userName && row.shzt == "待审核") {
                    /* '<button class="btn-white btn btn-xs">查看</button>'+ */
                    html += '<button id="edit_btn" class="btn btn-outline-secondary btn-sm"  onclick="operation.editWindow(' + index + ')">编辑</button>';
                    html += '<button class="btn btn-outline-secondary btn-sm"  onclick="operation.deleteFrom(' + index + ')">删除</button>';
                    return html;
                } else if (row.planFzr == userName) {
                    /* '<button class="btn-white btn btn-xs">查看</button>'+ */
                    html += '<button id="edit_btn" class="btn btn-outline-secondary btn-sm"  onclick="operation.editWindow(' + index + ')">编辑</button>';
                    html += '<button id="edit_btn" class="btn btn-outline-secondary btn-sm"  onclick="operation.tj(' + index + ')">提交</button>';
                    html += '<button class="btn btn-outline-secondary btn-sm"  onclick="operation.deleteFrom(' + index + ')">删除</button>';
                    return html;
                }
            },
            setActImgUrl: function (value, row, index) {
                return '<img src="/TBook/queryPic?id=' + row.id + '" style="width:100px;heigth:100px"></img>';
            },
            setBorrow: function (value, row, index) {
                var htm = "";
                if (row.borrow == 0) {
                    htm = "未借阅";
                }
                if (row.borrow == 1) {
                    htm = "<span style='color:red;'>已借阅</span>";
                }
                return htm;
            },
        }

        var columns = [[
            /*
            {
                field: 'ck',
                width: '2%',
                checkbox: false,
                align: 'center',

            },*/
            {
                field: 'id',
                title: 'id',
                width: 10,
                align: 'center',
                visible: false
            },

            {title: '任务名称', field: 'planName', align: 'center', valign: 'middle', visible: true},
            {title: '检修部位', field: 'planType', align: 'center', valign: 'middle', visible: true},
            {title: '计划描述', field: 'planInfo', align: 'center', valign: 'middle', visible: true},
            {title: '计划完成时间', field: 'planFinishTme', align: 'center', valign: 'middle', visible: true},
            {title: '计划周期', field: 'planZq', align: 'center', valign: 'middle', visible: true},
            {title: '工时', field: 'planWorkhours', align: 'center', valign: 'middle', visible: true},
            {title: '附件', field: 'planFj', align: 'center', valign: 'middle', visible: true, formatter: fmt.download},
            {title: '审核状态', field: 'shzt', align: 'center', valign: 'middle', visible: true},
            {title: '拒绝原因', field: 'jjyy', align: 'center', valign: 'middle', visible: true},
            {title: '负责人', field: 'planFzr', align: 'center', valign: 'middle', visible: true},
            {title: '车间', field: 'planCj', align: 'center', valign: 'middle', visible: true},
            {title: '创建时间', field: 'createTime', align: 'center', valign: 'middle', visible: true},
            {title: '操作', field: 'opt', align: 'center', valign: 'middle', visible: true, formatter: fmt.setOpt},


        ]];


        $('#dg').bootstrapTable({
            url: "/ZcxPlanTask/query",
            sidePagination: "server",
            queryParams: fmt.queryParams,
            method: "post",
            contentType: "application/x-www-form-urlencoded",
            pagination: true,
            pageNumber: 1,
            pageSize: 10,
            pageList: [10, 25, 50, 100],
            //search:true,
            clickToSelect: true,
            singleSelect: true,
            toolbar: '#toolbar',
            columns: columns,
        })

    });


    $(function () {
        $("#setFormId").bootstrapValidator({
            /* live:'disabled',
            excluded:[':disabled'],
            feedbackIcons: {
        　　　　　　　　valid: 'glyphicon glyphicon-ok',
        　　　　　　　　invalid: 'glyphicon glyphicon-remove',
        　　　　　　　　validating: 'glyphicon glyphicon-refresh'
    　　　　　   },*/
            fields: {

                shzt: {
                    validators: {
                        notEmpty: {
                            message: "审核结果不能为空!",
                        },

                    }

                },
                jjyy: {
                    validators: {
                        callback: {
                            message: '拒绝原因不能为空',
                            callback: function (value, validator, $field) {
                                var shzt = $('#shzt').val();
                                if ("拒绝" == shzt && value) {
                                    return false;
                                }
                                return true;
                            }
                        }

                    }

                },


                planName: {
                    validators: {
                        notEmpty: {
                            message: "任务名称不能为空!",
                        },
                    }

                },


                planInfo: {
                    validators: {
                        notEmpty: {
                            message: "任务描述不能为空!",
                        },
                    }

                },
            }

        });


    })


</script>

</body>

</html>
